<template>
  <div class="table-box">
    <ProTable ref="proRef" :columns="columns" :request-api="getAccountAuditList">
      <template #update_time="{ row }">
        {{ dayjs(row.update_time).format("YYYY-MM-DD HH:mm:ss") }}
      </template>
      <template #status="{ row }">
        <el-tag type="warning" v-show="row.status === 1">未审核</el-tag>
        <el-tag type="success" v-show="row.status === 2">已审核</el-tag>
      </template>
      <template #result="{ row }">
        <el-tag type="info" v-show="row.result === 1">审核中</el-tag>
        <el-tag type="success" v-show="row.result === 2">审核通过</el-tag>
        <el-tag type="danger" v-show="row.result === 3">审核不通过</el-tag>
      </template>
      <template #opera="{ row }">
        <el-button link :icon="Pointer" @click="opera(row)" v-if="row.status === 1">处理</el-button>
        <el-button link :icon="Search" @click="check(row)">查看</el-button>
      </template>
    </ProTable>
    <accountDialog ref="accRef"></accountDialog>
    <audit ref="auRef"></audit>
  </div>
</template>

<script setup lang="ts">
import ProTable from "@/components/ProTable/index.vue";
import { ColumnProps } from "@/components/ProTable/interface";
import { ref } from "vue";
import { getAccountAuditList, auditAccount } from "@/api/modules/audit";
import dayjs from "dayjs";
import { Search, Pointer } from "@element-plus/icons-vue";
import accountDialog from "../components/accountDialog.vue";
import audit from "../components/audit.vue";

const proRef = ref<InstanceType<typeof ProTable> | null>();

const columns: ColumnProps[] = [
  { prop: "update_time", label: "提交时间" },
  { prop: "presenter", label: "提交人" },
  { prop: "presentRole", label: "提交角色" },
  { prop: "belongName", label: "所属账号" },
  { prop: "status", label: "审核状态" },
  { prop: "result", label: "审核结果" },
  { prop: "opera", label: "操作" }
];

const accRef = ref<InstanceType<typeof accountDialog> | null>();

const auRef = ref<InstanceType<typeof audit> | null>();

const opera = (row: any) => {
  const params: any = {
    row,
    api: auditAccount,
    getTable: proRef.value?.getTableList
  };
  auRef.value?.acceptParams(params);
};

const check = (row: any) => {
  accRef.value?.acceptParams(row);
};
</script>

<style></style>
